<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>模板管理</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="__PUBLIC__/js/jquery.min.js"></script>
<script type="text/javascript" src="__PUBLIC__/js/formValidator.js"></script>
<script type="text/javascript" src="__PUBLIC__/js/formValidatorRegex.js"></script>
<script type="text/javascript" src="__PUBLIC__/Admin/js/function.js"></script>
<link rel='stylesheet' type='text/css' href='__PUBLIC__/Admin/css/admin_style.css' />
<script>

function IFrameResize(){
 //alert(this.document.body.scrollHeight); //弹出当前页面的高度
 var obj = parent.document.getElementById("template_tab");  //取得父页面IFrame对象
 //alert(obj.height); //弹出父页面中IFrame中设置的高度
 var heights = document.body.clientHeight;
 obj.height = heights;  //调整父页面中IFrame的高度为此页面的高度
 //alert(heights);
}
</script>
<script type="text/javascript">

	function checkAddAttrs(){
		if($('#attlist').find('table').length>0){
			$('#dosubmit').show();
			$("#prompt").hide();
		}else{
			$('#dosubmit').hide();
			$("#prompt").show();
		}
	};
	$(document).ready(function(){
		$('#dosubmit').hide();
		$.formValidator.initConfig({formid:"myform",autotip:true,onerror:function(msg,obj){
			window.top.art.dialog({content:msg,lock:true,width:250,height:100,ok:function(){$(obj).focus();}});
		}});
		//$('#div_add').hide();
		IFrameResize();
		$('#doadd').click(function(){
					var str='<table cellpadding="4" cellspacing="1" class="table" width="98%" id="sites">';
					str+='<tr class="tr rt">';
					str+='<td width="150">属性名称</td>';
					str+='<td colspan="3" class="lt">';
						str+='<input type="text" name="att_name[]" value="" /><input type="button" class="button" value="删除" id="remove"/>';
					str+='</td>'
					str+='</tr>';
					str+='<tr class="tr rt" id="tr_select">';
					str+='<td width="100">选择控件类型</td>';
					str+='<td colspan="3" class="lt">';
						str+='	<select id="type_select" name="att_type[]" style="width:100px" >';
						str+='		<option value=1>文本框</option>';
						str+='		<option value=2>复选框</option>';
						str+='		<option value=3>下拉框</option>';
						str+='		<option value=-1 selected="">请选择</option>';
						str+='	</select>';
					str+='</td>';
					str+='</tr>';
					str+='<tr class="tr rt">';
					str+='<td width="100">计量单位</td>';
					str+='<td colspan="3" class="lt">';
					str+='	<select id="unit_select" name="unit_select[]" style="width:100px" >';
						str+='		<option value=1>有</option>';
						str+='		<option value=0 selected="">无</option>';
					str+='	</select>';
						str+='&nbsp;&nbsp;&nbsp;<input type="text" name="att_unit[]" id="unit" readonly="" value="" />';
					str+='</td>';
					str+='</tr>';
					str+='</table>';
					$('#attlist').append(str);
					checkAddAttrs();
					IFrameResize();
				});
		//这个on方法是为原先没出现在 html页面的 标签绑定事件
			$(document).on("click", "#remove", function(){ 
				$(this).parents('table#sites').remove();
				checkAddAttrs();
				IFrameResize();
			});
			/*
			$("#add").click(function(){
				$("#prompt").hide();
				$('#div_add').show();
				IFrameResize();
			});
			*/
			$(document).on("change", "#unit_select", function(){ 
				var option = $(this).val();
				switch(option){
					case '1':
						$(this).parents('table#sites').find('#unit').removeAttr("readonly");
					break;
					default:
						$(this).parents('table#sites').find('#unit').attr("readonly",true);
					}
				});
			$(document).on("change", "#type_select", function(){ 
				var option = $(this).val();
				if ($(this).parents("table#sites").find('#textarea').length > 0) {
    				//do sth	
					$(this).parents("table#sites").find('#textarea').remove();
				}
				var str="";
				str+='<tr class="tr rt" id="textarea">';
				switch(option){
					case '1':
						str+='<input type="hidden" name="att_values[]" value=""/>';
					break;
					case '2':
					case '3':
						str+='<td width="100">属性值列表(回车分开)</td>';
						str+='<td colspan="3" class="lt">';
						str+='<textarea name="att_values[]" id="att_values" style="width:500px;height:75px" placeholder="换行区分"></textarea>';
						str+='</td>'
					break;
					default:
						alert("请选择类型");
				}
				str+='</tr>';
				//alert($(this).parents('div').size());
				$(this).parents('table#sites').append(str);
				IFrameResize();
				//if ($(this).parents('table#sites').find('#att_values').length > 0) 
					//$(this).parents('table#sites').find('#att_values').formValidator({onshow:"请输入选项值，用回车分开"}).inputValidator({max:250,onerror:"你输入的描述长度不正确,请确认"});
				
			});
			
	});
</script>
</head>
<body >
	
			<div id="display_template">
			
					<table cellpadding="5" cellspacing="1" class="table" width="98%" id="sites">
					
				<col width="100"/>
				<col />
				<col width="30"/>
				<col width="70"/>
					<tr >
						<td colspan="4" class="table_title">
						<span class="fl">模板具体样式预览</span>
						<span class="fr">
							<notempty name="list">
								<input class="bginput" type="button" name="dodelete" id="dodelete" style="width:80px" value="删除模板" onclick="return confirmurl('{:U('/Admin/Exhibit/template_del/',array('exhibittype_id'=>$_GET['id']))}','确定删除该模板吗?')"/>
							</notempty>	
							<input class="bginput" type="submit" name="doreload" id="doreload" style="width:50px" value="刷新" onclick="window.location.reload();" >
						</span>
						</td>
					</tr>
					
		<empty name="list">
			<tr class="tr">
				<td colspan="4" align='center'>
					<div id="prompt">
						<h2>该类别暂时还没有模板</h2>
					</div>	
				</td>
			</tr>
		<else/>
					<tr class="list_head ct">
						<td >属性名称</td>
						<td >属性元素</td>
						<td >状态</td>
						<td >管理操作</td>
					</tr>
						<volist name="list" id="vo">
							<tr class="tr rt">
							<td  >{$vo.att_name}</td>
							<td  class="lt" width="400px">
								{$vo.html_value}
							</td>
							<td align='center'><eq name="vo.status" value="1"><font color="red">√</font><else/><font color="blue">×</font></eq> 
							<td align='center'>
								<a href="{:U('/Admin/Exhibit/template_delone/',array('id'=>$vo['id'],'exhibittype_id'=>$vo['exhibittype_id']))}">修改</a>|
								<a href="javascript:void(0)" onclick="return confirmurl('{:U('/Admin/Exhibit/template_delone/',array('id'=>$vo['id'],'exhibittype_id'=>$vo['exhibittype_id']))}','确定删除该属性吗?')">删除</a>
							</td>
							</tr>
						</volist>	
		</empty>
		</table>
		<form action="{:U('Admin/Exhibit/template_add')}" method="post" name="form" id="template_add">
						<div id="attlist">
						</div>
						<div>
							<input type="hidden" name="exhibittype_id" value="<?php echo $_GET['id'];?>"/>
							<empty name="list">
							<input class="bginput" type="button" name="doadd" id="doadd" style="width:80px" value="添加属性">
							<else/>
							<input class="bginput" type="button" name="doadd" id="doadd" style="width:80px" value="继续添加">
							</empty>
								&nbsp;
							<input class="bginput" type="submit" name="dosubmit" id="dosubmit" style="width:50px" value="提 交">
						</div>
					</form>
		</div>
</body>
</html>